<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>商品订单列表</title>
    <link rel="stylesheet" th:href="@{/src/css/layui.css}">
</head>
<body>
<blockquote class="layui-elem-quote list_search">
    <div class="layui-inline">
        <!--0-未支付 1-已支付 2-未发货 3-已发货 4-已完成 5-请求退款 6-退款中 7-已取消-->
        <select id="status" name="status" style="height: 35px;border-radius: 3px;border-color: #b2b2b2" lay-verify="" lay-search>
            <option value="">-订单状态-</option>
            <option value="0">未支付</option>
            <option value="1">已支付</option>
            <option value="2">未发货</option>
            <option value="3">已发货</option>
            <option value="4">已完成</option>
            <option value="5">请求退款</option>
            <option value="6">退款中</option>
            <option value="7">已取消</option>
        </select>
    </div>
    <div class="layui-inline">
        <a class="layui-btn layui-btn-normal findByTitle"
           data-type="findByTitle"><i class="layui-icon">&#xe63d;</i>搜索</a>
    </div>
    <div class="layui-inline">
        <a class="layui-btn layui-btn-normal checkStatus"
           data-type="findByTitle"><i class="layui-icon">&#xe628;</i>更改</a>
    </div>
</blockquote>
<script type="text/html" id="sratus">
    <!--0-未支付 1-已支付 2-未发货 3-已发货 4-已完成 5-请求退款 6-退款中 7-已取消-->
    {{#  if(d.status == 0){ }}
    <span>未支付</span>
    {{#  } else if(d.status == 1) { }}
    <span>已支付</span>
    {{#  } else if(d.status == 2) { }}
    <span>未发货</span>
    {{#  } else if(d.status == 3) { }}
    <span>已发货</span>
    {{#  } else if(d.status == 4) { }}
    <span>已完成</span>
    {{#  } else if(d.status == 5) { }}
    <span>请求退款</span>
    {{#  } else if(d.status == 6) { }}
    <span>退款中</span>
    {{#  } else if(d.status == 7) { }}
    <span>已取消</span>
    {{#  } }}
</script>
<table id="dynamicList" lay-filter="dynamicList" class="layui-hidden"></table>
<script th:src="@{/src/layui.js}"></script>
<script>
    layui.use(['jquery','layer','laypage','laytpl','table','laydate','form'],function () {
        var $ = layui.jquery,
            layer = layui.layer,
            laypage = layui.laypage,
            laytpl = layui.laytpl,
            form = layui.form,
            table = layui.table,laydate = layui.laydate;
        table.render({
            elem:'#dynamicList',
            url:'/deal/goodsOrderList',
            title:'商品订单列表',
            cellMinWidth:80,
            page:true,
            limit:10,
            cols:[
                [
                    {type:'checkbox'},
                    {title:'订单编号',field:'orderNum'},
                    {title:'创建时间',field:'createTime'},
                    {title:'订单价格',field:'price',width:90},
                    {title:'下单用户',field:'account'},
                    {title:'更新时间',field:'updateTime'},
                    {title:'收货地址',field:'shippingPlace'},
                    {title:'订单状态',field:'status',templet:'#sratus'}
                ]
            ],parseData:function(result){
                return {
                    code:result.code==200?0:result.code,
                    msg:result.message,
                    count:result.data.total,
                    data:result.data.list
                }
            }
            ,initSort: {
                field: 'createTime' //排序字段，对应 cols 设定的各字段名
                ,type: 'desc' //排序方式  asc: 升序、desc: 降序、null: 默认排序
            }
        });
        //批量删除
        $('.checkStatus').click(function () {
            //获取选中的数据
            var checkStatus = table.checkStatus('dynamicList');
            var data = checkStatus.data;
            if (data.length == 0) {
                layer.msg("请选择订单数据", {icon: 5});
                return;
            }
            var ids = '';
            $.each(data, function (index, comment) {//遍历数组，取出动态id
                if (index == data.length - 1) {
                    ids += comment.id;
                } else {
                    ids += comment.id + ',';
                }
            })
            $.ajax({
                url: '/deal/checkGoodsOrder',
                type: 'put',
                data: {
                    'ids': ids,
                    'status': $('#status').val()
                },//传id字符串到后端
                dataType: 'json',
                success: function (result) {
                    if (result.code == 200) {
                        layer.msg(result.message, {icon: 1}, function () {
                            location.reload();
                        })
                    } else {
                        layer.msg(result.message, {icon: 5});
                    }
                }
            })
        })
        //模糊查询
        $('.findByTitle').click(function () {
            table.reload('dynamicList', {
                url: '/deal/goodsOrderList'
                ,where: {
                    status:$('#status').val()
                } //设定异步数据接口的额外参数
                ,initSort: {
                    field: 'createTime' //排序字段，对应 cols 设定的各字段名
                    ,type: 'desc' //排序方式  asc: 升序、desc: 降序、null: 默认排序
                }
                ,parseData:function(result){
                    return {
                        code:result.code==200?0:result.code,
                        msg:result.message,
                        count:result.data.total,
                        data:result.data.list
                    }
                }
            });
        })
    })
</script>

</body>
</html>